<!-- 添加自动化 -->
<template>
  <div>
    <el-dialog
      v-model="dialogVisible"
      width="60%"
      class="mydialogstyle"
      :close-on-click-modal="false"
      :showClose="false"
      :before-close="Cancel"
      :style="{ 'background-color': backgroundColor }"
    >
      <!-- 内容 -->
      <el-form label-position="left" :model="ruleForm" :rules="rules" ref="ruleFormRef">
        <!-- 模板名称 和 备注 的input -->
        <div style="display: flex">
          <span style="flex: 1.5; margin-top: 0.5%">模板名称</span>
          <el-form-item style="display: inline-block; flex: 8" prop="auto_tmp_name">
            <el-input v-model="ruleForm.auto_tmp_name" placeholder="请输入模板名称"></el-input>
          </el-form-item>
          <span style="flex: 1.5; margin-top: 0.5%">备注</span>
          <el-form-item style="display: inline-block; flex: 8" prop="remark">
            <el-input v-model="ruleForm.remark" placeholder="请输入备注"></el-input>
          </el-form-item>
        </div>

        <!-- 场景和自动化 -->
        <div style="display: flex">
          <!-- 场景  -->
          <span style="flex: 1.5; margin-top: 0.5%">场景</span>
          <el-form-item style="display: inline-block; flex: 8">
            <el-card
              v-if="ScenariosShow"
              style="width: 100%; overflow: hidden; max-height: 680px; overflow-y: scroll"
            >
              <!-- 场景 内容 -->
              <div style="margin-bottom: 10px; padding: 0 3%">场景名称</div>
              <el-input
                style="width: 100%; padding: 0 3%"
                v-model="ScenariosList.ScenariosName"
                placeholder="请输入场景名称"
              ></el-input>
              <!-- 执行动作 -->
              <el-form-item label="执行动作" style="padding: 3%">
                <div>
                  <el-dropdown trigger="click">
                    <el-link type="primary" :underline="false">添加动作</el-link>
                    <el-icon class="el-icon--right">
                      <arrow-down />
                    </el-icon>
                    <template #dropdown>
                      <el-dropdown-menu>
                        <el-dropdown-item @click="AutoActions">设备</el-dropdown-item>
                        <el-dropdown-item @click="ActionsTime">延时</el-dropdown-item>
                      </el-dropdown-menu>
                    </template>
                  </el-dropdown>
                </div>
                <el-col v-for="(item, index) in ActionsList" :key="index">
                  <el-card>
                    <div
                      style="
                        display: flex;
                        align-items: center;
                        justify-content: space-between;
                        flex-direction: row;
                        width: 100%;
                        height: 100%;
                      "
                    >
                      <div style="flex: 2">
                        <img src="../../assets/cs.png" alt="" style="display: block; width: 100%" />
                      </div>
                      <div style="flex: 9; word-wrap: break-word; word-break: break-all">
                        <span v-for="(event, num) in item" :key="num">
                          <div v-if="num === 0" style="font-size: 20px">
                            {{ event.deviceName }}
                          </div>
                          <span> {{ event.statusName }} ： </span>
                          <span v-if="event.statusName === '定时器时长'">
                            {{ displayRuleText1(event.statusValue, event.rendermod2) }} s
                          </span>
                          <span v-else>
                            {{ displayRuleText1(event.statusValue, event.rendermod2) }} |
                          </span>
                        </span>
                      </div>
                      <div style="flex: 1">
                        <el-link @click="ActionsDelete(index)" :underline="false">
                          <el-icon style="font-size: 20px"><DeleteFilled /></el-icon>
                        </el-link>
                      </div>
                    </div>
                  </el-card>
                </el-col>
              </el-form-item>
              <!-- 设备预警 -->
              <el-form-item label="设备预警" style="padding: 0 3%">
                <div>
                  <el-dropdown trigger="click">
                    <el-link type="primary" :underline="false">添加预警</el-link>
                    <el-icon class="el-icon--right">
                      <arrow-down />
                    </el-icon>
                    <template #dropdown>
                      <el-dropdown-menu>
                        <el-dropdown-item @click="DeviceAlert">设备预警</el-dropdown-item>
                      </el-dropdown-menu>
                    </template>
                  </el-dropdown>
                  <el-col v-for="(item, index) in DeviceAlertList" :key="index">
                    <el-card>
                      <div
                        style="
                          display: flex;
                          align-items: center;
                          justify-content: space-between;
                          flex-direction: row;
                          width: 100%;
                          height: 100%;
                        "
                      >
                        <div style="flex: 2">
                          <img
                            src="../../assets/cs.png"
                            alt=""
                            style="display: block; width: 100%"
                          />
                        </div>
                        <div style="flex: 9; word-wrap: break-word; word-break: break-all">
                          <!-- <span v-for="(event, num) in item" :key="num">
                              <div v-if="num === 0">{{ event.deviceName }}</div>
                              <span> {{ event.statusName }} ： </span>
                              <span>
                                {{ displayRuleText1(event.statusValue, event.rendermod2) }} |
                              </span>
                            </span> -->
                          <span>{{ item.alertName }}</span>
                        </div>
                        <div style="flex: 1">
                          <el-link @click="DeviceAlertDelete(index)" :underline="false">
                            <el-icon style="font-size: 20px"><DeleteFilled /></el-icon>
                          </el-link>
                        </div>
                      </div>
                    </el-card>
                  </el-col>
                </div>
              </el-form-item>
              <!-- 场景 取消/确定 -->
              <div style="float: right; text-align: center; margin-bottom: 1%">
                <el-button @click="ScenariosCancel">取 消</el-button>
                <el-button type="primary" @click="Scenariosumbit">确 定</el-button>
              </div>
            </el-card>
            <el-button v-else style="width: 100%" @click="ScenariosToggle">+</el-button>
          </el-form-item>

          <!-- 自动化 -->
          <span style="flex: 1.5; margin-top: 0.5%">自动化</span>
          <el-form-item style="display: inline-block; flex: 8">
            <div
              style="width: 100%; margin-bottom: 2%"
              v-for="(item, index) in AutomationList"
              :key="index"
            >
              <template v-if="AutomationList.length">
                <el-card style="width: 100%" v-if="item.isShow">
                  <div style="display: flex; justify-content: space-between; align-items: center">
                    <span style="flex: 4">{{ item.autoShedName }}</span>
                    <div style="flex: 5">
                      停用
                      <el-switch
                        v-model="item.status"
                        style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
                        active-value="AUTO_SCHED_STATUS_RUN"
                        inactive-value="AUTO_SCHED_STATUS_STOP"
                      />
                      启用
                    </div>
                    <div style="flex: 2">
                      <el-link
                        @click="checkCard(item, index)"
                        :underline="false"
                        :disabled="AutomationShow"
                        >展开编辑</el-link
                      >
                    </div>
                    <div style="flex: 1">
                      <el-popconfirm
                        width="220"
                        confirm-button-text="是"
                        cancel-button-text="否"
                        title="是否确认删除"
                        @confirm="AutomationDelete(index)"
                      >
                        <template #reference>
                          <el-icon style="font-size: 16px"><DeleteFilled /></el-icon>
                        </template>
                      </el-popconfirm>
                    </div>
                  </div>
                </el-card>
              </template>
            </div>
            <!-- 自动化管理 -->
            <el-card
              v-if="AutomationShow"
              style="width: 100%; overflow: hidden; max-height: 70vh; overflow-y: scroll"
              ref="Cardstyle"
            >
              <!-- 自动化表单 -->
              <el-form :model="AutomationForm" :rules="Automationrules" ref="AutomationFormRef">
                <!-- 自动化名称 -->
                <el-form-item label="自动化名称" style="padding: 1%" prop="autoShedName">
                  <el-input
                    v-model="AutomationForm.autoShedName"
                    placeholder="请输入自动化名称"
                  ></el-input>
                </el-form-item>
                <!-- 自动化条件类型 -->
                <el-form-item label="自动化条件类型" style="padding: 1% 1% 0 1%">
                  <el-select
                    v-model="AutomationForm.logicOperator"
                    placeholder="请选择自动化条件类型"
                  >
                    <el-option
                      v-for="item in AutoTemplate[0]"
                      :key="item.key"
                      :label="item.key"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
                <!-- 执行条件 -->
                <el-form-item>
                  <div>
                    <el-dropdown trigger="click">
                      <el-link type="primary" :underline="false" style="margin: 8px 0 0 5px"
                        >添加条件</el-link
                      >
                      <el-icon class="el-icon--right">
                        <arrow-down />
                      </el-icon>
                      <template #dropdown>
                        <el-dropdown-menu>
                          <el-dropdown-item @click="AutoConditions">设备</el-dropdown-item>
                          <el-dropdown-item @click="ConditionsTime">延时</el-dropdown-item>
                          <el-dropdown-item @click="timing">定时</el-dropdown-item>
                          <el-dropdown-item @click="timePeriod">时间段</el-dropdown-item>
                          <el-dropdown-item @click="ConditionsVariable">系统变量</el-dropdown-item>
                          <el-dropdown-item @click="ConditionsSystem">系统参数</el-dropdown-item>
                          <el-dropdown-item @click="OpenConditionsCounters"
                            >计数器</el-dropdown-item
                          >
                        </el-dropdown-menu>
                      </template>
                    </el-dropdown>
                  </div>
                  <draggable
                    v-model="ConditionsList"
                    group="ConditionsList"
                    @start="onDragStart"
                    @end="onDragEnd"
                    item-key="id"
                    handle=".drag-handle"
                  >
                    <template #item="{ element, index }">
                      <el-col :key="index">
                        <el-card>
                          <div
                            style="
                              display: flex;
                              align-items: center;
                              justify-content: space-between;
                              flex-direction: row;
                              width: 100%;
                              height: 100%;
                            "
                          >
                            <div style="flex: 2" class="drag-handle">
                              <img
                                src="../../assets/cs.png"
                                alt=""
                                style="display: block; width: 100%"
                              />
                            </div>

                            <div
                              style="flex: 6; word-wrap: break-word; word-break: break-all"
                              @click="hangldchange(index)"
                            >
                              <span v-for="(event, num) in element" :key="num">
                                <span
                                  v-if="event.conditionType === 'AUTO_SCHED_CONDITION_TYPE_DEVICE'"
                                >
                                  <div v-if="num === 0" style="font-size: 20px">
                                    {{ event.deviceName }}
                                  </div>
                                  <span v-if="event.statusName === 'SystemVariable'">
                                    {{ event.deviceName }} ：
                                  </span>
                                  <span v-else-if="event.Change === 'System'">
                                    {{ event.name }} ：
                                  </span>
                                  <span v-else-if="event.Change === 'Conditions'">
                                    {{ event.name }} ：
                                  </span>
                                  <span v-else-if="event.Change === 'ConditionsCounters'">
                                    {{ event.propertyName }} ：
                                  </span>
                                  <span v-else-if="event.Change === 'TimeTask'">
                                    {{ event.name }} ：
                                  </span>
                                  <span v-else> {{ event.statusName }} ： </span>
                                  <span>
                                    {{ displayRuleText(event.checkValue, event.rendermod1) }} &nbsp;
                                  </span>
                                  <span v-if="event.renderModel === 'select'">
                                    {{ displayRuleText1(event.statusValue, event.rendermod2) }} |
                                  </span>
                                  <span v-else> {{ event.statusValue }} | </span>
                                </span>
                                <!-- 定时 -->
                                <span
                                  v-if="event.conditionType === 'AUTO_SCHED_CONDITION_TYPE_TIMED'"
                                >
                                  <span style="font-size: 20px"> {{ event.statusName }} </span>
                                  <div>{{ event.startTime }}</div>
                                  <span v-for="(day, index) in event.dayall" :key="index"
                                    >{{ day }}|</span
                                  >
                                </span>
                                <!-- 时间段 -->
                                <span
                                  v-if="
                                    event.conditionType === 'AUTO_SCHED_CONDITION_TYPE_TIME_PERIOD'
                                  "
                                >
                                  <span style="font-size: 20px"> {{ event.statusName }} </span>
                                  <div>{{ event.startTime }}--{{ event.endTime }}</div>
                                  <!-- <span v-for="(week, index) in event.week" :key="index"
                                >{{ week }}|</span
                              > -->
                                </span>
                              </span>
                            </div>
                            <!-- <div style="flex: 2" @click="ConditionsDelete(item, index)">
                              <el-link :underline="false" style="width: 100%">
                                <el-icon style="font-size: 20px"><DeleteFilled /></el-icon>
                              </el-link>
                            </div> -->
                          </div>
                        </el-card>
                      </el-col>
                    </template>
                  </draggable>
                </el-form-item>
                <!-- 执行动作 -->
                <el-form-item>
                  <div>
                    <el-dropdown trigger="click">
                      <el-link type="primary" :underline="false" style="margin: 8px 0 0 5px"
                        >添加动作</el-link
                      >
                      <el-icon class="el-icon--right">
                        <arrow-down />
                      </el-icon>
                      <template #dropdown>
                        <el-dropdown-menu>
                          <el-dropdown-item @click="AutoActions">设备</el-dropdown-item>
                          <el-dropdown-item @click="ActionsTime">延时</el-dropdown-item>
                          <el-dropdown-item @click="ActionsVariable">系统变量</el-dropdown-item>
                          <el-dropdown-item @click="OpenActionsCounters">计数器</el-dropdown-item>
                          <el-dropdown-item @click="OpenSpecialEquipment"
                            >特殊设备</el-dropdown-item
                          >
                        </el-dropdown-menu>
                      </template>
                    </el-dropdown>
                  </div>
                  <draggable
                    v-model="ActionsList"
                    group="people"
                    @start="onDragStart"
                    @end="onDragEnd"
                    item-key="id"
                    handle=".drag-handle"
                  >
                    <template #item="{ element, index }">
                      <el-col :key="index">
                        <el-card>
                          <div
                            style="
                              display: flex;
                              align-items: center;
                              justify-content: space-between;
                              flex-direction: row;
                              width: 100%;
                              height: 100%;
                            "
                          >
                            <div style="flex: 2" class="drag-handle">
                              <img
                                src="../../assets/cs.png"
                                alt=""
                                style="display: block; width: 100%"
                              />
                            </div>
                            <div
                              style="flex: 6; word-wrap: break-word; word-break: break-all"
                              @click="hangldchangeAction(index)"
                            >
                              <span v-for="(event, num) in element" :key="num">
                                <div v-if="num === 0" style="font-size: 20px">
                                  {{ SpecialdeviceName(event) }}
                                </div>
                                <span v-if="event.statusName === 'SystemVariable'">
                                  {{ event.deviceName }} ：
                                </span>
                                <span v-else-if="event.Change === 'TimeTaskActions'">
                                  {{ event.propertyName }} ：
                                </span>
                                <span v-else-if="event.Change === 'SpecialEquipment'">
                                  {{
                                    event.statusType === 'AUTO_SCHED_EXECUTION_REGISTER_WRITE'
                                      ? '写'
                                      : '读'
                                  }}
                                </span>
                                <span v-else> {{ event.statusName }} ： </span>
                                <span v-if="event.propertyName === '定时器时长'">
                                  <span v-if="event.tiemvalue">{{ event.tiemvalue }}</span>
                                  <span v-else>
                                    {{ displayRuleText1(event.statusValue, event.rendermod2) }} S
                                  </span>
                                </span>
                                <span
                                  v-else-if="
                                    event.statusType ===
                                    'AUTO_SCHED_EXECUTION_IS_VARIABLE_DVC_CONSTANT'
                                  "
                                >
                                  {{ event.name }}
                                </span>
                                <span v-else-if="event.Change === 'ActionCounters'">
                                  {{ displayRuleText1(event.statusType, event.rendermod2) }}
                                  {{ event.statusValue }} |
                                </span>
                                <span v-else-if="event.Change === 'SpecialEquipment'">
                                  <span v-if="event.operateRegisterType">
                                    --{{ getSpecialvalue(event).value1 }} | 寄存器地址为：
                                    {{ getSpecialvalue(event).registerAddress }}| 值为：
                                    {{ getSpecialvalue(event).status }}
                                  </span>
                                  <span v-else>
                                    --{{ getSpecialvalue(event).value1 }} |等于|

                                    {{ getSpecialvalue(event).status }}
                                  </span>
                                </span>
                                <span v-else>
                                  {{ displayRuleText1(event.statusValue, event.rendermod2) }} |
                                </span>
                              </span>
                            </div>
                            <!-- <div style="flex: 2" @click="ActionsDelete(index)">
                              <el-link :underline="false" style="width: 100%">
                                <el-icon style="font-size: 20px"><DeleteFilled /></el-icon>
                              </el-link>
                            </div> -->
                          </div>
                        </el-card>
                      </el-col>
                    </template>
                  </draggable>
                </el-form-item>
                <!-- 设备预警 -->
                <el-form-item>
                  <div>
                    <el-dropdown trigger="click">
                      <el-link type="primary" :underline="false" style="margin: 8px 0 0 5px"
                        >添加预警</el-link
                      >
                      <el-icon class="el-icon--right">
                        <arrow-down />
                      </el-icon>
                      <template #dropdown>
                        <el-dropdown-menu>
                          <el-dropdown-item @click="DeviceAlert">设备预警</el-dropdown-item>
                        </el-dropdown-menu>
                      </template>
                    </el-dropdown>
                    <draggable
                      v-model="DeviceAlertList"
                      group="people"
                      @start="onDragStart"
                      @end="onDragEnd"
                      item-key="id"
                      handle=".drag-handle"
                    >
                      <template #item="{ element, index }">
                        <el-col :key="index">
                          <el-card>
                            <div
                              style="
                                display: flex;
                                align-items: center;
                                justify-content: space-between;
                                flex-direction: row;
                                width: 100%;
                                height: 100%;
                              "
                            >
                              <div style="flex: 2" class="drag-handle">
                                <img
                                  src="../../assets/cs.png"
                                  alt=""
                                  style="display: block; width: 100%"
                                />
                              </div>
                              <div
                                style="flex: 6; word-wrap: break-word; word-break: break-all"
                                @click="handleAlert(index)"
                              >
                                <span>{{ element.alertName }}</span>
                              </div>
                              <!-- <div style="flex: 2">
                                <el-link
                                  @click="DeviceAlertDelete(index)"
                                  :underline="false"
                                  style="width: 100%"
                                >
                                </el-link>
                              </div> -->
                            </div>
                          </el-card>
                        </el-col>
                      </template>
                    </draggable>
                  </div>
                </el-form-item>
                <el-form-item style="float: right; margin-bottom: 1%">
                  <!-- <el-button @click="dds">测试</el-button> -->
                  <el-button @click="AutomationCancel">取 消</el-button>
                  <el-button type="primary" @click="AutomationSubmit">确 定</el-button>
                </el-form-item>
              </el-form>
            </el-card>
            <!-- 自动化表单显示 切换 button -->
            <el-button v-else style="width: 100%" @click="AutomationToggle">+</el-button>
          </el-form-item>
        </div>
      </el-form>

      <!-- 底部 -->
      <template #footer>
        <span class="dialog-footer">
          <!-- <el-button @click="dds">测试</el-button> -->
          <el-button @click="Cancel">取 消</el-button>
          <el-button type="primary" @click="Sumbit">确 定</el-button>
          <!-- <el-button type="primary" @click="ddddddddd">456789</el-button> -->
        </span>
      </template>
    </el-dialog>
  </div>
  <Conditions
    ref="Conditions"
    @conditions="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></Conditions>
  <ConditionsTiming
    ref="AutoConditionsTiming"
    @updataTiming="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></ConditionsTiming>
  <ConditionsTimePeriod
    ref="AutoTimePeriod"
    @updataTimePeriod="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></ConditionsTimePeriod>
  <SystemC ref="System" @conditions="SaveConditions" @DeleteConditions="ConditionsDelete"></SystemC>
  <ConditionsVariable
    ref="SystemVariable"
    @conditions="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></ConditionsVariable>
  <TimeTaskConditions
    ref="AutoTimeTaskConditions"
    @conditions="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></TimeTaskConditions>
  <ConditionsCounter
    ref="ConditionsCountersRef"
    @conditions="SaveConditions"
    @DeleteConditions="ConditionsDelete"
  ></ConditionsCounter>

  <Actions ref="Actions" @executions="SaveExecutions" @DeleteActions="ActionsDelete"></Actions>
  <ActionVariable
    ref="ActionVariableRef"
    @executions="SaveExecutions"
    @DeleteActions="ActionsDelete"
  ></ActionVariable>
  <TimeTaskActions
    ref="AutoTimeTaskActions"
    @executions="SaveExecutions"
    @DeleteActions="ActionsDelete"
  ></TimeTaskActions>
  <ActionCounters
    ref="ActionsCountersRef"
    @executions="SaveExecutions"
    @DeleteActions="ActionsDelete"
  ></ActionCounters>

  <DeviceAlert
    ref="addNotification"
    @update="getDeviceAlent"
    @DeleteAlert="DeviceAlertDelete"
  ></DeviceAlert>

  <SpecialEquipment
    ref="SpecialEquipmentRef"
    @executions="SaveExecutions"
    @DeleteActions="ActionsDelete"
  ></SpecialEquipment>
</template>
   
<script>
import { defineComponent, ref, computed } from 'vue'
import { v4 as uuidv4 } from 'uuid'
import { ElMessage } from 'element-plus'

import AutoRendermod1 from '../../MyJson/AutoRendermod1.json'
import AutoRendermod2 from '../../MyJson/AutoRendermod2.json'
import AutoTemplateJSON from '../../MyJson/AutoTemplate.json'
import TimeTaskdelete from './isdelete.json'

import Conditions from './Conditions/AutoConditions.vue'
import TimeTaskConditions from './Conditions/TimeTaskConditions.vue'
import ConditionsTiming from './Conditions/ConditionsTiming.vue'
import ConditionsTimePeriod from './Conditions/ConditionsTimePeriod.vue'
import SystemC from './Conditions/ConditionsSystem.vue'
import ConditionsVariable from './Conditions/ConditionsVariable.vue'
import ConditionsCounter from './Conditions/ConditionsCounters.vue'

import Actions from './Action/AutoActions.vue'
import TimeTaskActions from './Action/TimeTaskActions.vue'
import ActionVariable from './Action/ActionVariable.vue'
import ActionCounters from './Action/ActionCounters.vue'
import SpecialEquipment from './Action/SpecialEquipment.vue'

import DeviceAlert from './Action/DeviceAlert.vue'

import draggable from 'vuedraggable'

import until from '../../until/csUntil/deviceUtils'
export default defineComponent({
  components: {
    Conditions,
    Actions,
    DeviceAlert,
    TimeTaskActions,
    TimeTaskConditions,
    ConditionsTiming,
    ConditionsTimePeriod,
    SystemC,
    ConditionsVariable,
    ActionVariable,
    ActionCounters,
    ConditionsCounter,
    draggable,
    SpecialEquipment
  },
  setup(_, { emit }) {
    const displayRuleText = computed(() => {
      return (judgeValue, num) => {
        if (judgeValue) {
          const rule = AutoRendermod1.template[num].find((item) => item.value === judgeValue)
          return rule ? rule.name : ''
        }
      }
    })
    const displayRuleText1 = computed(() => {
      return (judgeValue, num) => {
        if (judgeValue) {
          const rule = AutoRendermod2.template[num].find((item) => item.value === judgeValue)
          return rule ? rule.name : judgeValue
        }
      }
    })

    const SpecialdeviceName = computed(() => {
      return (judgeValue) => {
        if (judgeValue.statusType === 'AUTO_SCHED_EXECUTION_REGISTER_READ') {
          return judgeValue.specialName
        } else {
          return judgeValue.deviceName
        }
      }
    })

    const getSpecialvalue = computed(() => {
      return (judgeValue) => {
        if (judgeValue?.operateRegisterType) {
          if (judgeValue.specialDeviceId) {
            return {
              value1:
                judgeValue.operateRegisterType === 'REGISTER_READ_OUTPUT'
                  ? '读输出寄存器'
                  : '读输入寄存器',
              registerAddress: judgeValue.statusValue,
              status: judgeValue.deviceName
            }
          } else {
            return {
              value1:
                judgeValue.operateRegisterType === 'REGISTER_WRITE_SINGLE'
                  ? '单个寄存器'
                  : '多个寄存器',
              registerAddress: judgeValue.registerAddressValue,
              status: judgeValue.statusValue
            }
          }
        }
        // 自定义设备
        else {
          if (judgeValue.statusType === 'AUTO_SCHED_EXECUTION_REGISTER_READ') {
            return {
              value1: '输出寄存器',
              status: judgeValue.deviceName
            }
          } else {
            return {
              value1: '输入寄存器',
              status: judgeValue.statusValue
            }
          }
        }
      }
    })

    // 模板 显示隐藏
    const dialogVisible = ref(false)
    // 模板 表单
    const ruleForm = ref({
      id: '1',
      auto_tmp_name: '',
      remark: '',
      status: 'AUTO_TMP_STATUS_UNUSED'
    })
    // 模板 表单校验规则
    const rules = ref({
      auto_tmp_name: [{ required: true, message: '请输入自动化名称', trigger: 'blur' }]
    })
    // 模板 表单实例对象
    const ruleFormRef = ref(null)
    //  导入 自动化模板JSon
    const AutoRendermodel1 = ref(AutoRendermod1.template)
    //  导入 自动化模板JSon
    const AutoRendermodel2 = ref(AutoRendermod2.template)
    //  导入 自动化JSON
    const AutoTemplate = ref(AutoTemplateJSON.template)
    // 自动化 按钮和card切换
    const AutomationShow = ref(false)
    // 自动化 数组
    const AutomationList = ref([])
    // 自动化 表单
    const AutomationForm = ref({
      id: '1',
      scenesId: '-1',
      autoTmpId: '2',
      type: 'AUTO_SCHED_TYPE_FULFIL',
      status: 'AUTO_SCHED_STATUS_RUN',
      autoShedName: '',
      logicOperator: 'AUTO_SCHED_LOGIC_OR',
      conditions: [],
      executions: [],
      isShow: true
    })
    // 自动化 表单 实例对象
    const AutomationFormRef = ref(null)
    // 自动化 校验规则
    const Automationrules = ref({
      autoShedName: [{ required: true, message: '请输入自动化名称', trigger: 'blur' }]
    })
    // 自动化执行条件的实例对象
    const Conditions = ref(null)
    // 自动化 条件保存 传递过来的数组
    const ConditionsList = ref([])
    // 自动化 条件名称
    const ConditionsName = ref([])
    // 自动化执行动作的实例对象
    const Actions = ref(null)
    // 自动化 条件保存 传递过来的数组
    const ActionsList = ref([])
    // 自动化 条件名称
    const ActionsName = ref([])
    // 自动化 条件 定时 实例对象
    const CronJobs = ref(null)
    // 自动化 预警的实例对象
    const addNotification = ref(null)
    // 自动化 预警保存  传递值
    const DeviceAlertList = ref([])
    // 自动化 条件定时 实例对象
    const AutoTimeTaskConditions = ref(null)
    // 自动化 动作定时 实例对象
    const AutoTimeTaskActions = ref(null)
    // 自动化 条件 定时 实例对象
    const AutoConditionsTiming = ref(null)
    // 自动化 条件 时间段 实例对象
    const AutoTimePeriod = ref(null)
    // 自动化 条件 系统 实例对象
    const System = ref(null)
    // 自动化 条件 系统变量  实例对象
    const SystemVariable = ref(null)
    const ActionsCountersRef = ref(null)
    const ConditionsCountersRef = ref(null)
    const SpecialEquipmentRef = ref(null)
    // // 自动化 条件 定时和时间段 共用数组
    // const TimingList = ref([])
    // 自动化 数组的索引
    const AutomationIndex = ref(null)
    // 自动化 数组的id
    const AutomationId = ref(null)
    // 自动化 动作 系统变量
    const ActionVariableRef = ref(null)
    // 自动化 动作 系统设置
    const ActionCountersRef = ref(null)
    const backgroundColor = ref('white')

    const isChange = ref('')
    const ChangeIndex = ref('')
    //
    //
    //
    //
    // 自动化 新增取消
    const AutomationCancel = () => {
      AutomationShow.value = false
      AutomationForm.value.isShow = true
      backgroundColor.value = '#FFFFFF'
      clearn()
    }
    // 自动化 提交表单
    const AutomationSubmit = async () => {
      await AutomationFormRef.value.validate((valid) => {
        if (valid) {
          if (AutomationId.value) {
            AutomationForm.value.isShow = true
            const newActionsList = []
            const newConditionsList = []
            // 处理条件列表
            ConditionsList.value.forEach((conditionslist) => {
              newConditionsList.push(...conditionslist)
            })

            // 处理动作列表
            ActionsList.value.forEach((executionslist) => {
              newActionsList.push(...executionslist)
            })
            newActionsList.push(...DeviceAlertList.value)
            AutomationForm.value.conditions = newConditionsList
            AutomationForm.value.executions = newActionsList
            AutomationList.value[AutomationIndex.value] = JSON.parse(
              JSON.stringify(AutomationForm.value)
            )
            AutomationCancel()
          } else {
            // 设置唯一标识符
            AutomationForm.value.id = uuidv4()

            // 处理条件列表
            ConditionsList.value.forEach((conditionslist) => {
              AutomationForm.value.conditions.push(...conditionslist)
            })

            // 处理动作列表
            ActionsList.value.forEach((executionslist) => {
              AutomationForm.value.executions.push(...executionslist)
            })

            // 添加设备警报列表
            AutomationForm.value.executions.push(...DeviceAlertList.value)

            // const foundObject =  AutomationList.value.find(item => item.id === AutomationId.value);
            AutomationForm.value.isShow = true
            // 将自动化表单值保存到列表中
            AutomationList.value.push(JSON.parse(JSON.stringify(AutomationForm.value)))
            // 输出最终保存的值
            // 清除表单
            AutomationCancel()
          }
        }
      })
    }
    // 自动化 切换
    const AutomationToggle = () => {
      AutomationShow.value = true
      backgroundColor.value = '#F7F7F7'
    }
    // 自动化 添加执行条件
    const AutoConditions = () => {
      Conditions.value.dialogVisible = true
      Conditions.value.filterList(ConditionsList.value)
      isChange.value = false
    }
    // 自动化 添加执行动作
    const AutoActions = () => {
      Actions.value.dialogVisible = true
      Actions.value.filterList(ActionsList.value)
      isChange.value = false
    }
    // 设备预警
    const DeviceAlert = () => {
      addNotification.value.dialogVisible = true
      isChange.value = false
    }
    // 自动化 条件 延时
    const ConditionsTime = () => {
      // AutoTimeTaskConditions.value.dialogVisible = true
      AutoTimeTaskConditions.value.filterList(ConditionsList.value)
      isChange.value = false
    }
    // 自动化 条件 定时
    const timing = () => {
      AutoConditionsTiming.value.dialogVisible = true
      isChange.value = false
    }
    // 自动化 条件 时间段
    const timePeriod = () => {
      AutoTimePeriod.value.dialogVisible = true
      isChange.value = false
    }
    // 自动化 条件 系统
    const ConditionsSystem = () => {
      System.value.openmyDialog()
      isChange.value = false
    }
    // 自动化 条件 系统变量
    const ConditionsVariable = () => {
      SystemVariable.value.openmyDialog()
      isChange.value = false
    }
    // 自动化 条件 计数器
    const OpenConditionsCounters = () => {
      ConditionsCountersRef.value.filterList(ConditionsList.value)
      isChange.value = false
    }
    // 自动化 动作 延时
    const ActionsTime = () => {
      // AutoTimeTaskActions.value.dialogVisible = true
      AutoTimeTaskActions.value.filterList(ActionsList.value)
      isChange.value = false
    }
    // 自动化 动作 系统变量
    const ActionsVariable = () => {
      // AutoTimeTaskActions.value.dialogVisible = true
      ActionVariableRef.value.openmyDialog(ActionsList.value)
      isChange.value = false
    }
    // 自动化 动作 计数器
    const OpenActionsCounters = () => {
      ActionsCountersRef.value.filterList(ActionsList.value)
      isChange.value = false
    }
    // 自动化 动作 特殊设备
    const OpenSpecialEquipment = () => {
      SpecialEquipmentRef.value.dialogVisible = true
      SpecialEquipmentRef.value.filterList(ActionsList.value)
      isChange.value = false
    }
    const isSubArrayIncluded = (subArray, mainArray) => {
      return subArray.every((element) => mainArray.includes(element.Change))
    }
    // 自动化 条件传值
    const SaveConditions = (data) => {
      if (isChange.value) {
        ConditionsList.value.splice(ChangeIndex.value, 1, JSON.parse(JSON.stringify(data)))
        isChange.value = false
      } else {
        const isdeleteitem = isSubArrayIncluded(data, TimeTaskdelete)
        // 筛选出来 延时
        if (!isdeleteitem) {
          //其它
          const flatData = ConditionsList.value.flat(Infinity)
          const index = flatData.findIndex((e) => e.deviceName === data[0].deviceName)
          if (index !== -1) {
            ConditionsList.value.splice(index, 1, JSON.parse(JSON.stringify(data)))
          } else {
            ConditionsList.value.push(JSON.parse(JSON.stringify(data)))
          }
        } else {
          ConditionsList.value.push(JSON.parse(JSON.stringify(data)))
        }
      }
    }
    // 自动化 动作传值
    const SaveExecutions = (data) => {
      if (isChange.value) {
        ActionsList.value.splice(ChangeIndex.value, 1, JSON.parse(JSON.stringify(data)))
        isChange.value = false
      } else {
        ActionsList.value.push(JSON.parse(JSON.stringify(data)))
      }
    }
    // 自动化 动作 报警传值
    const getDeviceAlent = (data) => {
      if (isChange.value) {
        DeviceAlertList.value.splice(ChangeIndex.value, 1, JSON.parse(JSON.stringify(data)))
        isChange.value = false
      } else {
        DeviceAlertList.value.push(JSON.parse(JSON.stringify(data)))
      }
    }
    // 自动化 条件 定时
    const outTiming = (data, index) => {
      if (isChange.value) {
        ConditionsList.value.splice(ChangeIndex.value, 1, JSON.parse(JSON.stringify(data)))
        // ConditionsList.value.splice(ChangeIndex.value, 1)
        isChange.value = false
      } else {
        const outTimingList = JSON.parse(JSON.stringify(data))
        ConditionsList.value.push(outTimingList)
      }
    }
    // 自动化 条件 时间段
    const outTimePeriod = (data, index) => {
      if (isChange.value) {
        ConditionsList.value.splice(ChangeIndex.value, 1, JSON.parse(JSON.stringify(data)))
        // ConditionsList.value.splice(ChangeIndex.value, 1)
        isChange.value = false
      } else {
        const outTimingList = JSON.parse(JSON.stringify(data))
        ConditionsList.value.push(outTimingList)
      }
      // if (index != 'add') {
      //   ConditionsList.value.splice(index, 1)
      // }
      // const outTimePeriodList = JSON.parse(JSON.stringify(data))
      // // TimingList.value = outTimePeriodList
      // ConditionsList.value.push(outTimePeriodList)
    }

    // 自动化 条件
    // 自动化 删除 条件
    const ConditionsDelete = () => {
      ConditionsList.value.splice(ChangeIndex.value, 1)
      // }
    }
    // 自动化 删除 动作
    const ActionsDelete = () => {
      ActionsList.value.splice(ChangeIndex.value, 1)
    }
    // 自动化 删除当前项
    const AutomationDelete = (index) => {
      AutomationList.value.splice(index, 1)
    }
    // 自动化 删除报警
    const DeviceAlertDelete = () => {
      DeviceAlertList.value.splice(ChangeIndex.value, 1)
    }
    // 自动化 清除表单
    const clearn = () => {
      AutomationForm.value = {
        id: '1',
        scenesId: '-1',
        autoTmpId: '2',
        type: 'AUTO_SCHED_TYPE_FULFIL',
        status: 'AUTO_SCHED_STATUS_RUN',
        autoShedName: '',
        logicOperator: 'AUTO_SCHED_LOGIC_OR',
        conditions: [],
        executions: [],
        isShow: true
      }
      ConditionsList.value = []
      ActionsList.value = []
      DeviceAlertList.value = []
      AutomationIndex.value = null
      AutomationId.value = null
      // TimingList.value = []
    }
    // 自动化 crad 卡片折叠 显示
    const checkCard = (data, index) => {
      const newListex = data.executions.filter(
        (item) => item.executionType === 'AUTO_SCHED_EXECUTION_TYPE_DEVICE'
      )
      const newListco = data.executions.filter(
        (item) => item.executionType === 'AUTO_SCHED_EXECUTION_TYPE_ALERT'
      )
      data.isShow = false

      AutomationIndex.value = index
      AutomationId.value = data.id
      AutomationForm.value = data
      // 卡片隐藏或者显示
      AutomationShow.value = true
      // 条件
      ConditionsList.value = until.groupDevicesById(data.conditions)
      // 动作
      ActionsList.value = until.groupDevicesById(newListex)
      // 警报
      DeviceAlertList.value = newListco
      backgroundColor.value = '#F7F7F7'
    }
    //
    //
    //
    //
    // 场景 按钮和card切换
    const ScenariosShow = ref(false)
    // 场景 表单
    const ScenariosList = ref({ ScenariosName: '' })
    // 场景 提交表单
    const Scenariosumbit = () => {}
    // 场景 取消提交
    const ScenariosCancel = () => {
      ScenariosShow.value = false
    }
    // 场景 切换
    const ScenariosToggle = () => {
      ScenariosShow.value = true
    }

    // 模板 取消
    const Cancel = () => {
      backgroundColor.value = '#FFFFFF'
      dialogVisible.value = false
      ruleForm.value.auto_tmp_name = ''
      ruleForm.value.remark = ''
      AutomationList.value = []
      AutomationShow.value = false
      // TimingList.value = []
    }
    // 模板 确定
    const Sumbit = async () => {
      ruleFormRef.value.validate((validate) => {
        if (validate) {
          if (AutomationShow.value) {
            ElMessage.error('请先保存再提交')
          } else {
            ruleForm.value.id = uuidv4()
            const deleteid = ruleForm.value.id
            const res = window.api.insertAutoTemplate(JSON.stringify(ruleForm.value))

            if (res === '新增成功') {
              AutomationList.value.forEach((item) => {
                item.autoTmpId = ruleForm.value.id
              })
              const result = window.api.CUDAutoSchedule(
                JSON.stringify(AutomationList.value),
                ruleForm.value.id
              )
              if (result === '新增成功') {
                ElMessage.success(result)
                ruleForm.value = {
                  id: '',
                  auto_tmp_name: '',
                  remark: '',
                  status: 'AUTO_TMP_STATUS_UNUSED'
                }

                emit('update')
                clearn()
                Cancel()
              } else {
                window.api.removeAutoTmp(deleteid)
                ElMessage.error(result)
              }
            } else {
              ElMessage.error(res)
            }
          }
        }
      })
    }

    const hangldchange = (index) => {
      const items = ConditionsList.value[index]
      ChangeIndex.value = index
      isChange.value = true
      // 条件修改
      if (items) {
        // 条件
        // 设备
        if (items[0].Change === 'Conditions') {
          Conditions.value.dialogVisible = true
          Conditions.value.filterList(ConditionsList.value)
          Conditions.value.DeviceChange(items[0].deviceId)
          Conditions.value.SelectDevice = items[0].deviceId
          Conditions.value.conditions = ConditionsList.value[index]
          Conditions.value.showDelete = isChange.value
        }
        // 延时
        else if (items[0].Change === 'TimeTask') {
          AutoTimeTaskConditions.value.filterList(ConditionsList.value)
          AutoTimeTaskConditions.value.DeviceChange(items[0].deviceId)
          AutoTimeTaskConditions.value.SelectDevice = items[0].deviceId
          AutoTimeTaskConditions.value.conditions = ConditionsList.value[index]
          AutoTimeTaskConditions.value.showDelete = isChange.value
        }
        // 定时
        else if (items[0].Change === 'Time') {
          AutoConditionsTiming.value.changeValue(ConditionsList.value[index])
          AutoConditionsTiming.value.showDelete = isChange.value
        }
        // 时间段
        else if (items[0].Change === 'TimePeriod') {
          AutoTimePeriod.value.changeValue(ConditionsList.value[index])
          AutoTimePeriod.value.startTime = ConditionsList.value[index][0].startTime
          AutoTimePeriod.value.endTime = ConditionsList.value[index][0].endTime
          AutoTimePeriod.value.showDelete = isChange.value
        }
        // 系统变量
        else if (items[0].Change === 'Variable') {
          SystemVariable.value.openmyDialog()
          SystemVariable.value.DeviceChange(items[0].deviceId)
          SystemVariable.value.SelectDevice = items[0].deviceId
          SystemVariable.value.SystemVariable = ConditionsList.value[index]
          SystemVariable.value.showDelete = isChange.value
        }
        // 系统参数
        else if (items[0].Change === 'System') {
          System.value.openmyDialog()
          System.value.DeviceChange(items[0].statusName)
          System.value.SelectDevice = items[0].statusName
          System.value.SystemVariable = ConditionsList.value[index]
          System.value.showDelete = isChange.value
        }
        // 计数器
        else if (items[0].Change === 'ConditionsCounters') {
          ConditionsCountersRef.value.filterList(ConditionsList.value)
          ConditionsCountersRef.value.DeviceChange(items[0].deviceId)
          ConditionsCountersRef.value.SelectDevice = items[0].deviceId
          ConditionsCountersRef.value.conditions = ConditionsList.value[index]
          ConditionsCountersRef.value.showDelete = isChange.value
        }
      }
    }

    const hangldchangeAction = (index) => {
      const items = ActionsList.value[index]
      ChangeIndex.value = index
      isChange.value = true
      // 动作修改
      if (items) {
        // 动作
        // 设备
        if (items[0].Change === 'Actions') {
          Actions.value.dialogVisible = true
          Actions.value.filterList(ActionsList.value)
          Actions.value.DeviceChange(items[0].deviceId)
          Actions.value.SelectDevice = items[0].deviceId
          Actions.value.executions = ActionsList.value[index]
          Actions.value.showDelete = isChange.value
        }
        // 延时
        else if (items[0].Change === 'TimeTaskActions') {
          AutoTimeTaskActions.value.filterList(ActionsList.value)
          AutoTimeTaskActions.value.DeviceChange(items[0].deviceId)
          AutoTimeTaskActions.value.SelectDevice = items[0].deviceId
          AutoTimeTaskActions.value.executions = ActionsList.value[index]
          AutoTimeTaskActions.value.selectTime = items[0].selectTime
          AutoTimeTaskActions.value.showDelete = isChange.value
          items.forEach((item) => {
            if (item.name === '定时器时长') {
              if (item.selectTime === '变量') {
                AutoTimeTaskActions.value.handleTime = item.showinfo
                AutoTimeTaskActions.value.handlechange(item.showinfo)
              }
              if (item.selectTime === '常量') {
                AutoTimeTaskActions.value.timeR = formatSeconds(item.statusValue)
              }
            }
          })
        }
        // 系统变量
        else if (items[0].Change === 'ActionVariable') {
          // ActionVariableRef.value.SelectDevice = items[0].deviceId
          ActionVariableRef.value.openmyDialog(ActionsList.value)
          ActionVariableRef.value.DeviceChange(items[0].deviceId)
          ActionVariableRef.value.selectTime = items[0].selectTime
          ActionVariableRef.value.SelectDevice = items[0].deviceId
          ActionVariableRef.value.showDelete = isChange.value
          if (items[0].selectTime === '常量') {
            ActionVariableRef.value.inputValue = items[0].statusValue
          } else {
            ActionVariableRef.value.changeValue = items[0].changetag
            ActionVariableRef.value.handleChange()
          }
        }
        // 计数器
        else if (items[0].Change === 'ActionCounters') {
          ActionsCountersRef.value.filterList(ActionsList.value)
          ActionsCountersRef.value.DeviceChange(items[0].deviceId)
          ActionsCountersRef.value.SelectDevice = items[0].deviceId
          ActionsCountersRef.value.executions = ActionsList.value[index]
          ActionsCountersRef.value.selectTime = items[0].selectTime
          ActionsCountersRef.value.showDelete = isChange.value
          ActionsCountersRef.value.checeout = items[0].statusType
        }
        // 特殊设备
        else if (items[0].Change === 'SpecialEquipment') {
          SpecialEquipmentRef.value.dialogVisible = true
          SpecialEquipmentRef.value.filterList(ActionsList.value[0])
          SpecialEquipmentRef.value.showDelete = isChange.value
          // 特殊设备
          if (items[0].operateRegisterType) {
            if (items[0].specialDeviceId) {
              SpecialEquipmentRef.value.SelectDevice = items[0].specialDeviceId
              SpecialEquipmentRef.value.DeviceChange(items[0].specialDeviceId)
              SpecialEquipmentRef.value.executions = items
            } else {
              SpecialEquipmentRef.value.SelectDevice = items[0].deviceId
              SpecialEquipmentRef.value.DeviceChange(items[0].deviceId)
              SpecialEquipmentRef.value.executions = items
            }
          }
          // 自定义设备
          else {
            const updatechangeid = JSON.parse(JSON.stringify(items[0].changeid))
            const updatedeviceId = JSON.parse(JSON.stringify(items[0].deviceId))
            const updateitems = JSON.parse(JSON.stringify(items))
            if (items[0].statusType === 'AUTO_SCHED_EXECUTION_REGISTER_READ') {
              SpecialEquipmentRef.value.SelectDevice = updatechangeid
              SpecialEquipmentRef.value.DeviceChange(updatechangeid)
              SpecialEquipmentRef.value.executions = updateitems
            } else {
              SpecialEquipmentRef.value.SelectDevice = updatedeviceId
              SpecialEquipmentRef.value.DeviceChange(updatedeviceId)
              SpecialEquipmentRef.value.executions = updateitems
            }
          }
        }
      }
    }

    const handleAlert = (index) => {
      const items = DeviceAlertList.value[index]
      ChangeIndex.value = index
      isChange.value = true
      if (items) {
        if (items.Change === 'DeviceAlert') {
          addNotification.value.dialogVisible = true
          addNotification.value.form.alertId = items.alertId
          addNotification.value.changeContact()
          addNotification.value.showDelete = isChange.value
        }
      }
    }

    const formatSeconds = (seconds) => {
      // 计算小时数
      const hours = Math.floor(seconds / 3600)
      // 计算剩余的秒数
      seconds %= 3600
      // 计算分钟数
      const minutes = Math.floor(seconds / 60)
      // 计算剩余的秒数
      const remainingSeconds = seconds % 60

      // 格式化为两位数
      const formattedHours = String(hours).padStart(2, '0')
      const formattedMinutes = String(minutes).padStart(2, '0')
      const formattedSeconds = String(remainingSeconds).padStart(2, '0')

      return `${formattedHours}:${formattedMinutes}:${formattedSeconds}`
    }

    const Cardstyle = ref(null)

    let scrollInterval = ref(null)
    const scrollTopx = ref([])

    const updateTouchPosition = (event) => {
      if (event.touches && event.touches.length > 0) {
        Cardstyle.value.$el.scrollTop < 20
          ? (Cardstyle.value.$el.scrollTop = 20)
          : Cardstyle.value.$el.scrollTop
        const element = Cardstyle.value.$el

        // 将当前触摸点的Y坐标存入数组
        scrollTopx.value.push(event.touches[0].clientY)
        const num1 = scrollTopx.value[scrollTopx.value.length - 1]
        const num2 = scrollTopx.value[scrollTopx.value.length - 2]
        const num3 = scrollTopx.value[scrollTopx.value.length - 3]

        // 当数组长度大于3时，检查滚动方向
        if (scrollTopx.value.length > 3) {
          if (num1 > num2 && num2 > num3) {
            // 向下滚动
            startScrolling(element, 'down')
          } else if (num1 < num2 && num2 < num3) {
            // 向上滚动
            startScrolling(element, 'up')
          }
        }
      }
    }

    const startScrolling = (element, direction) => {
      stopScrolling() // 先停止之前的定时器

      scrollInterval.value = setInterval(() => {
        if (direction === 'down') {
          element.scrollTop += 5
        } else if (direction === 'up') {
          element.scrollTop -= 5
        }
      }, 20)
    }

    const stopScrolling = () => {
      if (scrollInterval.value) {
        clearInterval(scrollInterval.value)
        scrollInterval.value = null
      }
    }

    // 拖动开始时的处理函数
    const onDragStart = (evt) => {
      window.addEventListener('touchmove', updateTouchPosition)
    }

    // 拖动结束时的处理函数
    const onDragEnd = (evt) => {
      stopScrolling()
      scrollTopx.value = []
      window.removeEventListener('touchmove', updateTouchPosition)
    }
    return {
      scrollTopx,
      onDragStart,
      onDragEnd,
      scrollInterval,
      Cardstyle,
      dialogVisible,
      ruleForm,
      ScenariosShow,
      ScenariosList,
      AutomationShow,
      AutomationForm,
      AutoTemplate,
      AutoRendermodel1,
      AutoRendermodel2,
      Conditions,
      Actions,
      ConditionsName,
      ConditionsList,
      displayRuleText,
      ActionsName,
      ActionsList,
      rules,
      ruleFormRef,
      AutomationFormRef,
      Automationrules,
      AutomationList,
      CronJobs,
      addNotification,
      displayRuleText1,
      SpecialdeviceName,
      getSpecialvalue,
      DeviceAlertList,
      AutoTimeTaskConditions,
      AutoTimeTaskActions,
      AutoTimePeriod,
      AutoConditionsTiming,
      AutomationIndex,
      AutomationId,
      System,
      SystemVariable,
      ActionVariableRef,
      ActionCountersRef,
      backgroundColor,
      isChange,
      ChangeIndex,
      ConditionsCountersRef,
      ActionsCountersRef,
      SpecialEquipmentRef,
      DeviceAlert,
      Scenariosumbit,
      ScenariosCancel,
      ScenariosToggle,
      AutomationToggle,
      Cancel,
      Sumbit,
      AutoConditions,
      AutoActions,
      AutomationCancel,
      AutomationSubmit,
      ConditionsTime,
      ActionsTime,
      SaveConditions,
      SaveExecutions,
      ConditionsDelete,
      ActionsDelete,
      AutomationDelete,
      checkCard,
      getDeviceAlent,
      DeviceAlertDelete,
      timing,
      timePeriod,
      outTiming,
      outTimePeriod,
      ConditionsSystem,
      ConditionsVariable,
      ActionsVariable,
      hangldchange,
      hangldchangeAction,
      handleAlert,
      OpenConditionsCounters,
      OpenActionsCounters,
      OpenSpecialEquipment
    }
  }
})
</script>
  
  <style  lang="less" scoped>
::v-deep .el-card__body {
  margin: 0px !important;
  padding: 3px;
}
::v-deep .el-dialog {
  float: right;
  height: 100%;
  margin: 0 !important;
  overflow: hidden;
  max-height: 100% !important;
  overflow-y: scroll;
}

/* 修改滚动条的轨道（Track）样式 */
::-webkit-scrollbar {
  width: 3px; /* 设置滚动条宽度 */
  height: 20px;
}

/* 修改滚动条的滑块（Thumb）样式 */
::-webkit-scrollbar-thumb {
  background: skyblue; /* 设置滚动条滑块的背景颜色 */
  border-radius: 5px; /* 设置滚动条滑块的圆角 */
}

/* 修改滚动条的轨道（Track）背景样式 */
::-webkit-scrollbar-track {
  background: white; /* 设置滚动条轨道的背景颜色 */
}

/* 修改滚动条的轨道（Track）背景样式，当鼠标悬停在滚动条上时 */
::-webkit-scrollbar-track:hover {
  background: white; /* 设置悬停时的背景颜色 */
}
</style>
   
  